<script>
  import sheep from '@/sheep';

  export default {
    data() {
      return {
        imgUrls: [
          {
            image_input: [
              `${sheep.$store('AI').sq_image_path}/chineseSurname/21.png`,
            ],
            url: '/pages/chineseSurname/index?index=0',
          },
          {
            image_input: [
              `${sheep.$store('AI').sq_image_path}/chineseSurname/22.png`,
            ],
            url: '/pages/chineseSurname/index?index=1',
          },
          {
            image_input: [
              `${sheep.$store('AI').sq_image_path}/chineseSurname/23.png`,
            ],
            url: '/pages/chineseSurname/index?index=3',
          },
          {
            image_input: [
              `${sheep.$store('AI').sq_image_path}/chineseSurname/24.png`,
            ],
            url: '/pages/chineseSurname/index?index=5',
          },
          {
            image_input: [
              `${sheep.$store('AI').sq_image_path}/chineseSurname/25.png`,
            ],
            url: '/pages/chineseSurname/index?index=4',
          },
        ],
      };
    },
    computed:{
      nc_image(){
        return sheep.$store('AI').nc_image
      }
    },
    async created() {
      const { data } = await sheep.$api.family.getBannerImageList();
      this.imgUrls = data;
    },
  };
</script>

<template>
  <!-- 家谱轮播图 -->
  <view class="wh_702 hW_420" v-if="imgUrls.length > 0" style="border-radius: 8rpx;overflow: hidden">
    <swiper
      class="wh_702 hW_420"
      autoplay
      circular
      indicator-color="rgba(255,255,255,0.1)"
      indicator-active-color="#fff"
      :interval="3000"
      :duration="500"
    >
      <block v-for="(item,index) in imgUrls" :key="index">
        <swiper-item v-if="item.image">
          <navigator :url="item.url">
            <image :src="item.image.indexOf('http') != -1 ? item.image : `${nc_image}${item.image}`" class="wh_702 hW_420" />
          </navigator>
        </swiper-item>
      </block>
    </swiper>
  </view>
</template>

<style scoped lang="scss">

</style>